<!DOCTYPE html>
<html lang=ko>
<head>
	<meta charset="UTF-8">
	<title>obj_2.html</title>
	<link rel='stylesheet' type='text/css' href='../css/main.css'/>
	<script>
	var count=0;
	function NewObj()
	{
		this.name;
		this.kor;
		this.mat;
		this.eng;
		this.tot='';
		this.avg='';
		
		this.setData = 
			function(name, kor, mat, eng)
			{
				this.name = name;
				this.kor = kor;
				this.mat = mat;
				this.eng = eng;
			}
	}
	function prn(obj)
	{
		var re= "<tr><td>" + obj.name +
				"</td><td>" + obj.kor +
				"</td><td>" + obj.mat +
				"</td><td>" + obj.eng +
				"</td><td>" + obj.tot +
				"</td><td>" + obj.avg +
				"</td><td></td></tr>";
		
			return re;
		 
//		r.innerHTML = o2.getData();
		
	}
	function compute(obj)
	{
		obj.tot = parseInt(obj.kor) + parseInt(obj.mat) + parseInt(obj.eng);
		obj.avg = obj.tot / 3;
	}
	function init()
	{
		var obj = new Array();
		var sendBtn = document.getElementById('send');
		var prnBtn = document.getElementById('prn');
		var r = document.getElementById('result');
		
		sendBtn.onclick = function()
		{
			if(isNaN(kor.value)||kor.value=='')
			{
				if((isNaN(mat.value)||mat.value=='')&&(isNaN(eng.value)||eng.value==''))
				{
					kor.focus();
					kor.value='';
					mat.value='';
					eng.value='';
					alert("kor, mat, eng에 숫자를 입력하여주세요.");
				}
				else if((isNaN(mat.value)||mat.value==''))
				{
					kor.focus();
					kor.value='';
					mat.value='';
					alert("kor, mat에 숫자를 입력하여주세요.");
				}
				else if((isNaN(eng.value)||eng.value==''))
				{
					kor.focus();
					kor.value='';
					eng.value='';
					alert("kor, eng에 숫자를 입력하여주세요.");
				}
				else
				{
					kor.focus();
					kor.value='';
					alert("kor에 숫자를 입력하여주세요");
				}
			}
			else if(isNaN(mat.value)||mat.value=='')
			{
				if(isNaN(eng.value)||eng.value=='')
				{
					mat.focus();
					mat.value='';
					eng.value='';
					alert("mat, eng에 숫자를 입력하여주세요.");
				}
				mat.focus();
				mat.value='';
				alert("mat에 숫자를 입력하여주세요");
			}
			else if(isNaN(eng.value)||eng.value=='')
			{
				eng.focus();
				eng.value='';
				alert("eng에 숫자를 입력하여주세요");
			}
			else
			{
				obj[count] = new NewObj();
				obj[count].setData(irum.value,kor.value,mat.value,eng.value);
				compute(obj[count]);
				count = count+1;
				
				irum.value="";
				kor.value="";
				mat.value="";
				eng.value="";
			}
		}
		prnBtn.onclick = function()
		{
			var re = "<table border=1><tr><th>성명</th><th>국어</th><th>수학</th><th>영어</th>"
					+"<th>총점</th><th>평균</th><th>비고</th></tr>";
			for(i=0;i<count;i++)
			{
				re += prn(obj[i]);
			}
			re += "</table>"
			r.innerHTML = re;
		}
	}
	</script>
</head>
<body>
	<!--
	 처리조건)
	 	1. 생성자를 통해 대입
	 	2. compute()를 사용하여 총점과 평균 계산(총점과 평균은 필드에 저장)
	 	3. prn()을 사용하여 출력
	 	4. 객체를 배열로 저장
	-->
	<form name="grade">
	<label>name:</label><input type=text id="irum" value="Hong"><br>
	<label>kor:</label><input type=text id="kor" value="100"><br>
	<label>mat:</label><input type=text id="mat" value="95"><br>
	<label>eng:</label><input type=text id="eng" value="88"><br>

	<input type=button id="send" value="저장">
	<input type=button id="prn" value="출력">

	</form>	

	<div id="result"></div>
	
	<script>init();</script>
</body>
</html>